/* miniprogram/pages/Home/Home.wxss */

.weixin {
  width: 100rpx;
  height: 100rpx;
  margin: 200rpx 340rpx 80rpx 340rpx;
}

.home-bgc {
  width: 750rpx;
  background: #f5f5f5;
}

.xian {
  margin: 0 50rpx 50rpx 50rpx;
}

.xians {
  margin: 0 50rpx 50rpx 50rpx;
  padding-top: 50rpx;
}

.center {
  width: 100%;
  padding: 50rpx;
  box-sizing: border-box;
  .sq {
    font-size: 35rpx;
    color: #666;
    margin-bottom: 20rpx;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .info {
    color: #999;
    font-size: 33rpx;
  }

  .bottom {
    width: 70%;
    margin: 70rpx auto;
    background: #4cd964;
    border-radius: 80rpx;
    font-size: 30rpx;
  }
}

.sj {
  width: 100%;
  text-align: center;
  margin-top: 300rpx;
}

.container {
  display: flex;
  align-items: center;
  margin: 86rpx 0 0 16rpx;
  box-sizing: border-box;
  .mapIcon {
    display: flex;
    align-items: center;
    image {
      width: 44rpx;
      height: 44rpx;
    }
    text {
      font-size: 20rpx;
      color: #333;
      width: 150rpx;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
  .searchBtn {
    position: relative;
    width: 350rpx;
    height: 57rpx;
    background: rgba(241, 241, 241, 1);
    border-radius: 29rpx;
    margin-left: 18rpx;
    display: flex;
    align-items: center;
    image {
      position: absolute;
      top: 8rpx;
      left: 23rpx;
      width: 44rpx;
      height: 44rpx;
    }
    text {
      font-size: 22rpx;
      color: #999;
      margin-left: 71rpx;
    }
  }
}
.topnavFixed {
  position: fixed;
  top: 0;
  z-index: 99;
  background: #07bd44;
  width: 100%;
  height: 190rpx;
  display: flex;
  align-items: center;
  padding: 100rpx 15rpx 0;
  box-sizing: border-box;
  transition: all 30ms linear 50ms;
  .mapIcon {
    display: flex;
    align-items: center;
    image {
      width: 44rpx;
      height: 44rpx;
    }
    text {
      font-size: 20rpx;
      color: #fff;
      width: 150rpx;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
  .searchBtn {
    position: relative;
    width: 350rpx;
    height: 57rpx;
    background: rgba(241, 241, 241, 1);
    border-radius: 29rpx;
    margin-left: 18rpx;
    display: flex;
    align-items: center;
    image {
      position: absolute;
      top: 8rpx;
      left: 23rpx;
      width: 44rpx;
      height: 44rpx;
    }
    text {
      font-size: 22rpx;
      color: #999;
      margin-left: 71rpx;
    }
  }
}
//公告
.announcement {
  // position: relative;
  width: 100%;
  height: 71rpx;
  background-color: #07bd44;
  line-height: 71rpx;
  color: #fff;
  font-size: 22rpx;
  margin: 16rpx 0;
  .van-notice-bar {
    height: 71rpx;
    line-height: 55rpx;
    padding: 0 80rpx 0 0;
  }
  .van-icon:before {
    display: block !important;
  }
  .van-notice-bar__right-icon {
    top: 7px;
  }
}
// .arrows{
//   position: absolute;
//   right:0;
//   top: 0;
//   background-color:#07bd44 ;
//   padding: 0 10rpx;
//   image{
//     width: 10rpx;
//     height: 15rpx;
//   }
// }
// .srcoll_view {
//   position: absolute;
//   top: 16rpx;
//   height: 100rpx;
//   margin-left: 0px;
//   font-size: 30rpx;
//   font-weight: 550;
//   white-space: nowrap;
//   color: #fff;
//   animation: myfirst 18s linear infinite;
//   // /滚动的速度/
// }
// @keyframes myfirst {
//   0% {
//     -webkit-transform: translateX(45%);
//   }
//   100% {
//     -webkit-transform: translateX(-45%);
//   }
//   // /滚动的位置到哪里/
// }
// .scroll_view_border {
//   position: relative;
//   width: 100%;
//   background-color: #07bd44;

//   height: 100rpx;
//   overflow: hidden;
//   align-content: center;
// }
@keyframes remindMessage {
  0% {
    -webkit-transform: translateX(90%);
  }
  100% {
    -webkit-transform: translateX(-360%);
  }
}

.tongzhitext {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.tongzhi-text {
  font-size: 28rpx;
  animation: remindMessage 22s linear infinite;
  width: 100%;
  color: #fff;
  display: block;
  margin-right: 50rpx;
}


.rotation {
  swiper {
    height: 304rpx !important;
  }
  image {
    display: block;
    width: 602rpx;
    height: 304rrpx;
    margin: auto;
  }
  .rotation-bottom {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10rpx 20rpx;
    box-sizing: border-box;
    .rotation_left {
      display: flex;
      align-items: center;
      margin-right: 115rpx;
      image {
        width: 24rpx;
        height: 24rpx;
      }
      text {
        font-size: 22rpx;
        color: #999;
        margin-left: 5rpx;
      }
    }
    .rotation_right {
      display: flex;
      align-items: center;
      margin-left: 115rpx;
      image {
        width: 24rpx;
        height: 24rpx;
      }
      text {
        font-size: 22rpx;
        color: #999;
        margin-left: 5rpx;
      }
    }
  }
}
.box {
  padding: 0 20rpx;
  box-sizing: border-box;
  margin-top: 20rpx;
  // 导航开始
  .index_carts {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    .index_carts_text {
      display: flex;
      align-items: center;
      flex-direction: column;
      padding: 10rpx 0;
      width: 20%;
      image {
        display: block;
        width: 100rpx;
        height: 100rpx;
        border-radius: 50%;
        text-align: center;
        margin: auto;
      }
      text {
        padding: 10rpx 0;
        display: block;
        font-size: 28rpx;
        font-weight: bold;
        color: #121212;
        font-family: "宋体";
      }
    }
  }
  .newParanoia {
    padding: 10rpx 0;
    image {
      width: 750rpx;
      height: 216rpx;
    }
  }
  // 楼层区域
  .floorArea {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 33rpx;
    .floorArea_left {
      image {
        width: 356rpx;
        height: 303rpx;
      }
    }
    .floorArea_right {
      display: flex;
      flex-direction: column;
      align-items: center;
      image {
        width: 331rpx;
        height: 146rpx;
      }
      // image:first-child {
      //   margin-bottom: 14rpx;
      // }
    }
  }
}
.trabecula {
  width: 100%;
  height: 18rpx;
  background-color: #f1efef;
  margin: 20rpx 0;
}

// 热品推荐商品
.recommend {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 25rpx;
  box-sizing: border-box;
  .recommend_left {
    text {
      font-size: 36rpx;
      color: #121212;
      font-weight: bold;
      font-family: "宋体";
    }
  }
  .recommend_right {
    image {
      width: 12rpx;
      height: 20rpx;
      margin-left: 4rpx;
    }
    text {
      font-size: 22rpx;
      color: #666;
    }
  }
}
.recommend_bottom {
  margin: 10rpx;

  .recommend_banner {
    width: 220rpx;
    display: flex;
    display: -webkit-box;
    flex-direction: column;
    text-align: center;
    .recommendCommodities {
      display: flex;
      flex-direction: column;
      text-align: center;
      margin-right: 15rpx;
      padding: 0 10rpx 10rpx;
      box-sizing: border-box;
      border: 1rpx solid #eee;
      border-radius: 10rpx;
      .shopping_img {
        width: 160rpx;
        height: 160rpx;
        margin: 10rpx auto;
        border-radius: 10rpx;
      }
      .title {
        font-size: 24rpx;
        font-weight: bold;
        color: #121212;
        text-align: left;
        text-overflow: -o-ellipsis-lastline;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        line-clamp: 1;
        -webkit-box-orient: vertical;
      }

      .page {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        .textRed {
          font-size: 24rpx;
          font-weight: bold;
          color: #ff0000;
          margin-bottom: 10rpx;
          text-align: left;
        }
        .textGreen {
          display: flex;
          align-items: center;
          justify-content: space-between;
          text:first-child {
            font-size: 22rpx;
            font-weight: bold;
            color: #07bd44;
          }
          text:last-child {
            display: block;
            width: 57rpx;
            height: 20rpx;
            background: #07bd44;
            border-radius: 10rpx;
            font-size: 12rpx;
            font-weight: 400;
            color: #ffffff;
            text-align: center;
            line-height: 20rpx;
            margin-left: 2rpx;
          }
        }
        image {
          display: inline-block;
          vertical-align: bottom;
          width: 50rpx;
          height: 50rpx;
        }
      }
    }
  }
}
.shopping_top {
  margin: 10rpx 20rpx 20rpx 20rpx;
  .van-tabs__line {
    background: none !important;
  }
  .van-tab--active {
    font-family: "PingFang-SC-Bold";
    font-size: 30rpx !important;
    font-weight: bold !important;
    color: #07bd44 !important;
  }

  /* 商品列表 */
  .goods {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-top: 35rpx;
    .goods-item {
      width: 50%;
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-bottom: 32rpx;
      .item-box {
        width: 340rpx;
        background-color: #fff;
        border-radius: 20rpx;
        display: flex;
        flex-direction: column;
        box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(0, 0, 0, 0.19);
        padding: 10rpx;
        box-sizing: border-box;
        image {
          display: block;
          width: 280rpx;
          height: 280rpx;
          margin: 10rpx auto 0;
          border-radius: 20rpx;
        }
        .titleName {
          font-size: 32rpx;
          font-weight: bold;
          color: #121212;
          margin: 10rpx 0;
          padding: 0 20rpx;
          box-sizing: border-box;
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 1;
        }
        .titleDescribe {
          margin-top: 50rpx;
          width: 262rpx;
          height: 24rpx;
          font-size: 24rpx;
          font-weight: 400;
          color: #666666;
        }
        .page_title {
          display: flex;
          align-items: flex-end;
          justify-content: space-between;
          margin-top: 15rpx;
          padding: 0 20rpx;
          box-sizing: border-box;
          .page_title_left {
            .textRed {
              font-size: 26rpx;
              font-weight: bold;
              color: #ff0000;
            }

            .member {
              display: flex;
              align-items: center;
              justify-content: space-between;
              .textGreen_current {
                font-size: 22rpx;
                font-weight: bold;
                color: #07bd44;
                margin-right: 20rpx;
              }
              .memberPrice {
                width: 57rpx;
                height: 20rpx;
                background: rgba(7, 189, 68, 1);
                border-radius: 10rpx;
                font-size: 12rpx;
                text-align: center;
                line-height: 20rpx;
                color: #fff;
                vertical-align: bottom;
              }
            }
            .sold {
              font-size: 20rpx;
              font-weight: 400;
              color: #999999;
              margin-top: 18rpx;
            }
          }

          .public_ico_shop {
            image {
              width: 50rpx;
              height: 50rpx;
              vertical-align: bottom;
            }
          }
        }
      }
    }
  }
  .goods_text {
    margin: 50% 0;
    text-align: center;
    font-size: 28rpx;
  }
}
